<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Contact</title>
</head>
<body>
    <h2 style="text-align: center;">Contact Form</h2>
    {% with messages = get_flashed_messages() %}
        {% if messages %}
            <ul>
                {% for message in messages %}
                <li> {{message}} </li>
                {% endfor %}
            </ul>
        {% endif %}
    {% endwith %}

    {% for message in form.name.errors %}
            <div> {{message}} </div>
    {% endfor %}
    
    {% for message in form.email.errors %}
            <div> {{message}} </div>
    {% endfor %}

    <form action="http://localhost:5000/contact" method="post">
        <fieldset>
            <legend>Contact Form</legend>

            <div style=" font: size 20px; font-weight:bold; margin: left 150px;">
                {{form.name.label}} <br>
                {{form.name}}
                <br>
                
                {{form.Gender.label}} {{form.Gender}}
                {{form.Address.label}} <br>
                {{form.Address}}
                <br>

                {{form.email.label}} <br>
                {{form.email}}
                <br>

                {{form.Age.label}} <br>
                {{form.Age}}
                <br>

                {{form.language.label}} <br>
                {{form.language}}
                <br>
                {{form.submit}}
            </div>
        </fieldset>
    </form>

</body>
</html>